Edit = {
		refreshDirections: function() {
			var waypoints = [];
			var waypointSpans = $("div#waypoints>ul>li>span");
			waypointSpans.slice(0, waypointSpans.length - 1)
					.each(function() {
						waypoints.push({
							location : $(this).html(),
							stopover : true
						});
					});

			if (waypointSpans.length) {
				var end = waypointSpans.filter(":last").html();
			}

			Maps.buildMap({
				start : $("#start").val(),
				waypoints : waypoints,
				end : end
			});
		},
		addWaypoint: function(name, id){
			$.ajax({
				url : "/addwaypoint",
				data : {
					trip : $("#tripId").val(),
					waypoint : name,
					id: id
				},
				type : "POST",
				success : function(data) {
					data = $.parseJSON(data);
					Edit.buildWaypointItem(data.waypointid, name, id);
				}
			});
},
		buildWaypointItem: function(waypointId, text, id)
		{
			waypointHTML = '<input id="address'+nextSearch*2+'" type="hidden" value="'+text+'" style="">'+
				'<input id="destcounts" type="hidden" value="15" name="destcounts" style="">'+
			'<li><span>'+text+'</span>'+
			'<img class="remove removeWaypoint" id="removeWaypoint21" src="/img/icons/close_32.png" '+
			'value="remove" /><ul class="suggestList">'+
			'<li><img src="img/icons/info_button_16.png">'+
'<a href="#" onclick="googlesearch(\''+nextSearch*2+'\');return false;">We can suggest things to do</a>'+
'</li>	      	</ul>	      	<ul class="poiList">	      		'+
'<li>	      			<div id="googleversion'+nextSearch*2+'" class="localexample hide">'+
'					    <div id="searchcontrol'+nextSearch*2+'" style="">Loading...</div>'+
'					    <ul id="searchresults'+nextSearch*2+'"></ul>					</div>'+
'	      		</li>	      	</ul>	      </li>';
			
			if(id == null)
				$("div#waypoints>ul").append(waypointHTML);
			else
				$("#removeWaypoint"+id).parent().after(waypointHTML);
			$("#waypoint").val("");
			Edit.refreshDirections();
			buildSearch();
		}
}

$(function() {
	$("#addWaypoint")
			.click(
					function(){
						Edit.addWaypoint($("#waypoint").val());
					});
	$("#tooltip_waypointBtn").click(function () {
		$("#tooltip_waypoint").toggle();
	}); 

	$(".addPoi").live("click", function(){
		Edit.addWaypoint(
				$(this).attr("locationInfo"),
				$(".addPoi:first").parent().parent().parent().parent().parent().parent().find(">img").attr("id").replace("removeWaypoint","")
		);
	});
	
	$(".removeWaypoint")
			.live(
					"click",
					function() {
						$.ajax({
									url : "/removewaypoint",
									data : {
										trip : $("#tripId").val(),
										dest : $(this).attr("id").replace("removeWaypoint","")
									},
									type : "POST",
									success : function(data) {
										data = $.parseJSON(data);
										$("#removeWaypoint"+data.destid).parent().remove();
										Edit.refreshDirections();
									}
								});
					});

	$("#directions,#loadStart").click(Edit.refreshDirections);

	$("#start").change(function(){
		$.ajax({
			url : "/addwaypoint",
			data : {
				trip : $("#tripId").val(),
				waypoint : $(this).val(),
				index: 0
			},
			type : "POST"
		});
	});
	
	Edit.refreshDirections();
	
	$("#sortWaypoints").sortable({
		revert: false,
		stop: function(event, ui) {
			Edit.refreshDirections();
			}
	});
	
	$("#tripName,#tripDescription").focus(function(){
		$(this).val($(this).attr("trueValue"));
	}).blur(function(){
		$(this).attr("trueValue",$(this).val());
		$(this).val($(this).attr("trueValue").substr(0,$(this).attr("displayLength")));
		if($(this).attr("trueValue").length > $(this).attr("displayLength"))
			$(this).val($(this).val()+"...");
		var data = {
				trip : $("#tripId").val()
			};
		var param = $(this).attr("param");
		data[param] = $(this).val();
		$.ajax({
			url : "/update" + param,
			data : data,
			type : "POST"
		});
	}).each(function(){
		$(this).attr("trueValue",$(this).val());
		$(this).val($(this).attr("trueValue").substr(0,$(this).attr("displayLength")));
		if($(this).attr("trueValue").length > $(this).attr("displayLength"))
			$(this).val($(this).val()+"...");
	});
});
